<template>
  <div class="app-container">
    <h2>方案优势</h2>

    <search-box
      :fields="searchFeilds"
      @search="handleSearch"
      @add="handleAdd"
    />


    <SearchResult
      uid="getSolveQuestionList"
      ref="searchResult"
      @edit="handleEdit"
    >
      <el-table-column label="解决问题名称" align="left">
        <template slot-scope="{row}">
          <span>{{ row.solveQuestionTitle }}</span>
        </template>
      </el-table-column>

      <el-table-column label="解决方案名称" align="left">
        <template slot-scope="{row}">
          <span>{{ row.solutionName }}</span>
        </template>
      </el-table-column>

      <el-table-column label="启用" align="center">
        <template slot-scope="{row}">
          <span>{{ row.isEnable === 1 ? '是' : '否' }}</span>
        </template>
      </el-table-column>

      <el-table-column label="图标" align="center">
        <template slot-scope="{row}">
          <el-image style="width: 48px; height: 48px" :src="row.imageId" fit="contain"></el-image>
        </template>
      </el-table-column>
    </SearchResult>

    <SolveQuestion
      :visible.sync="dialogVisible"
      title="解决问题"
      :data.sync="dialogForm"
    />
  </div>
</template>
<script>
import { EventBus } from '@/utils/event-bus';
import waves from '@/directive/waves';
import SearchBox from '@/components/SearchBox';
import SearchResult from '@/components/SearchResult';
import SolveQuestion from '@/components/DialogComponents/solve-question';
import { getLevelList, isEnableOptions } from '@/utils/config';

export default {
  name: 'advantage',
  components: { SearchBox, SearchResult, SolveQuestion },
  directives: { waves },
  data() {
    return {
      searchFeilds: [
        { name: 'SolveQuestionTitle', label: '解决问题标题', type: 'text' },
        { name: 'IsEnable', label: '是否启用', type: 'list', options: isEnableOptions }
      ],


      dialogForm: {},
      dialogVisible: false
    };
  },
  created() {
    EventBus.$emit('custom-breadcrumb', getLevelList(this.$options.name));
  },

  methods: {
    // 搜索
    handleSearch(data) {
      if (data === void 0) data = {};

      this.$refs['searchResult'].getData(data);
    },

    // 添加
    handleAdd() {
      this.dialogVisible = true;
      this.dialogForm = {}
    },

    // 编辑
    handleEdit(row) {
      this.dialogForm = row;
      this.dialogVisible = true;
    }
  }
}
</script>
